Откликнулись на челлендж 😎
Мы объединились в команду из 4 дизайнеров, чтобы поработать над приближенным к реальности кейсом, прокачать навыки в исследованиях и проектировании.
В поиске подходящих идей мы наткнулись на сайт uxchallenge.co и выбрали для себя задание из области финтеха, чтобы познакомиться со сферой, поработать над сложными интерфейсами больших продуктов.
В качестве челленджа мы выбрали задачу, в которой нужно было разобраться с нежелательными подписками. И эта задача показалась нам действительно актуальной. Как нам самим, так и нашему окружению становится трудно отслеживать все услуги, на которые мы подписаны.
Окунулись в планирование 🧐
Весь процесс работы мы разложили на Канбан-доске в Трелло и уложились в один спринт, который завершили юзабилити-тестированием получившегося решения и его анализом.
Выбрали продукт 🙄
Для того, чтобы приблизиться к реальной продуктовой задаче, мы решили работать над приложением Райффайзен Банк, поскольку мы им пользуемся, а также знаем где найти респондентов для тестирования.
Сгенерировали гипотезу 🤔️
Пользователи банковских сервисов хотят управлять
подписками внутри своих приложений
Исходя из задачи челленджа, сначала мы сформулировали проблемы. Они заключаются в том, что людям сложно отслеживать свои подписки, вспоминать о датах списаниях средств со счета, а иногда вообще об их существовании.
Так как мы решили работать над продуктовой задачей существующего банковского приложения, мы договорились рассматривать гипотезу, как подтвержденную.
Расписали джобсы ✍️
Поняв, что аудитория Райффайзен Банка слишком широкая, нам нужно было сделать фокус на цели использования приложения – мы пришли к методологии Jobs To Be Done. Это помогло нам определить работу, которую выполняет продукт для пользователя.
Проанализировали конкурентов 🙄
Мы попытались разобраться, какие решения есть у других компаний, чтобы сформировать более точные требования к разработке. Однако мы не нашли таких решений. В банковских приложениях нет возможности контролировать подписки.
Начали изучать приложения, разработанные для отслеживания подписок. В них мы нашли только возможность создавать подписки, как в записной книжке.
Узнали, как подписки можно отличать от других платежей 😎
В одном из приложений мы увидели МСС-код и решили покопать поглубже. Оказалось, что это код, фиксируемый при проведении транзакции через платежный терминал и все подписки он идентифицирует по цифрам:
5968
Провели тихий мозговой штурм 🤫
Мы провели брейншторм в зуме в формате “Тихого штурма”: сначала записали в течении 20 минут свои идеи на общую доску, затем начали их зачитывать и обсуждать.
Выявив путем голосования жизнеспособные идеи, мы составили список функций, которые решили встроить в приложение.
Пытались не запутать 😵💫
Мы вернулись к нашим джобсам, взглянули на карту приложения и начали думать над целями, которые пользователь достигнет, выполняя свои задачи внутри сервиса.
Слепили макет из компонентов 😏
Мы декомпозировали приложение Райффайзен Банка на компоненты, начиная с атомов, нашли шрифт и иконки в открытом доступе. Создали упрощенный UI-kit и начали воссоздавать уже существующие экраны из нашего User Flow. Это дало нам возможность быстро встраивать в приложение различные решения.
Сделали раздел компактным 🤏
Мы попробовали несколько вариантов расположения раздела с подписками. Пытались расположить его как в верхней части экрана, так и в разных видах карточек.
Страница “Переводы” изначально предназначена для осуществления платежей и акцентирование большого внимания на подписках здесь ни к чему. Тем более действия с подписками совершаются редко.
Все подписки размещены на отдельной странице, отсортированы по сроку ближайшего платежа.
Информация о подписке в таком виде позволяет увидеть ближайшую дату платежа за подписку, а также сумму платежа.
Учли состояния подписок 🖐
Некоторые подписки могут быть в базе приложения, они распознаются, им присваивается изображение сервиса.
Если пользователь добавил подписку на сервис, которого нет в базе приложения, появляется стандартное изображение в виде иконки.
Определили возможные подписки 👈
Если в истории есть повторяющийся платеж, либо же платёж произведен в размере 1 ₽, то транзакция определяется как “вероятная подписка”
Отобразили нужную информацию 🙌
Информация о подписке выдается в формате Bottom Sheet. Это устоявшийся паттерн приложения. Содержание окон отличается в зависимости от статуса подписки.
Активные подписки подсвечивают дату следующего списания, тариф, а также логин личного кабинета на сервисе.
Предложили функцию отмены подписок 👌
При отмене подписки через банковское приложении перестают осуществляться переводы средств за услуги.
Мы также предлагаем пользователю также перейти на сайт сервиса, чтобы отменить подписку и там – иначе могут поступать различные ненужные оповещения от представителя услуг.
Сделали рабочий макет 😏
Используя подготовленный UI-kit, подглядывая в настоящее приложение и, опираясь на выбранные джобсы, мы отрисовали полностью интерактиный прототип по отработанному User Flow.
Составили сценарий тестирования ✏️
Лучшим способом проверить наши решения было провести тестирование на реальных пользователях. Чтобы получить от него максимум пользы, мы начали с определения цели и создания сценария тестирования.
Провели юзабилити-тестирование 🧐
Каждый из нас взял себе по респонденту. В качестве целевой аудитории мы определили пользователей приложения Райфа с опытом использования одновременно нескольких подписок. Провели тестирование на 5 клиентах.
Прошлись по заданиям 🤔
1. Искали информацию об активной подписке Яндекс.Плюс
1. Искали информацию об активной подписке Яндекс.Плюс
В ходе поиска информации о подписке, респонденты дольше ожидаемого искали раздел “Подписки”, каждый из них сперва искал на странице “Ещё”, обосновывая это тем, что с разделом “Переводы” они не ассоциируются.
2. Искали списание за пробную подписку и добавляли её в свой список подписок
2. Искали списание за пробную подписку и добавляли её в свой список подписок
Все респонденты довольно легко справились с заданием, спотыкаясь в основном на текст задания, не понимая что такое “Список подписок”
3. Отписывались от пробной подписки
3. Отписывались от пробной подписки
Респонденты быстро нашли нужный сервис в разделе “Подписки” и отписались. Один из респондентов не поняла, почему нужно переходить на сайт сервиса, проверять подписку и запуталась, задав вопрос:
“Так отписалась я или нет?”
“Так отписалась я или нет?”
Подвели итоги 😏
Респондентов было всего пятеро, но этого оказалось достаточно, чтобы обратить внимание на те моменты, которые нам казались понятными.
Например, мы поняли, что расположение раздела с подписками оказалось неочевидным и следует проверить гипотезу, что пользователи ожидают увидеть его на странице “Ещё”. Заметили, насколько понятна респондентам была функция отмены подписки и насколько очевидно их описание в разных состояниях.
Получили крутой опыт 😎
Мы взглянули на продуктовую разработку через призму розовых очков, не учли многих обстоятельств: взаимодействия с разработкой и аналитикой. Но мы попрактиковались в исследованиях, проектировании и тестировании мы набрались опыта в командной работе, погрузились в атмосферу продуктовой разработки, научились разделять задачи и ставить приоритеты, пополнили своё портфолио новым кейсом и продолжаем развиваться дальше.
Пока мы делали кейс, один дизайнер нашел работу, другой – получил повышение. Ну а остальные, пока находятся в активном поиске – собирают новую команду и снова готовятся к вызовам.
Пока мы делали кейс, один дизайнер нашел работу, другой – получил повышение. Ну а остальные, пока находятся в активном поиске – собирают новую команду и снова готовятся к вызовам.
Хотите к нам? Пишите! 🤗🔥🚀
